/* eslint-disable */
<template>
<div class="rating_page">
     <!-- <head-top head-title="培训签到" go-back='true'></head-top> -->
      <x-header id="head_top" :left-options="{showBack: false}">培训签到<a slot="right">{{name}}</a></x-header>
      <x-button v-if="showButton" mini type="warn" @click.native="sign()">{{signStatus}}</x-button>
     <div v-for="(item, index) in task" :key="index">
         <div v-if="item.label==='培训材料'">
        <h4>培训材料</h4>
        <template>
            <li v-for="(file, index) in files" :key="index">
                 <a  v-if="type(file.name)==='word'" target="_blank" :href="previewUrl+downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else-if="type(file.name)==='pdf'" target="_blank" :href="downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else-if="type(file.name)==='img'" target="_blank" :href="downloadUrl+file.qkey" :v-text="file.name"><span>{{file.name}}</span></a>
                <a  v-else target="_blank" :href="downloadUrl+file.qkey+'?attname='+encodeURI(encodeURI(file.name))" :v-text="file.name"><span>{{file.name}}</span></a>
            </li>
        </template>
    </div>
          <cell v-else :title="item.label" :value="item.value" primary="content"></cell>
     </div>
    <!-- link="BACK" -->
   <!-- <x-button  v-if="showButton" mini plain type="warn" link="BACK" >取消</x-button> -->
</div>
</template>
<script>
import { CellFormPreview, Group, Cell, XButton, XTextarea, XSwitch,  XHeader } from "vux";
import headTop from "src/components/head";
import {
  // getDDUserInfo,
  // getUser,
  getAcDetail, signInfo } from "src/service/actual";
import csAvatar from "@/components/Customer/csAvatar";

export default {
  name: "register",
  data() {
    return {
      downloadUrl: process.env.downloadUrlQn,
      previewUrl: process.env.previewUrl,
      sys: "",
      eventId: "",
      code: "",
      name: "",
      userInfo: null,
      task: [],
      showButton: false,
      actual: {
        id: undefined
      },
      signStatus: "签到"
    };
  },
  components: {
    headTop,
    CellFormPreview,
    Group,
    Cell,
    XButton,
    XTextarea,
    XSwitch,
    csAvatar,
     XHeader,
  },
    watch: {
    userCode2: function(newvalue, oldvale) {
      // console.log("watch-userInfo",newvalue,oldvale)
      console.log("this.$store.state.user",this.$store.state.user)
       this.userInfo = this.$store.state.user;
      this.code = this.userInfo.user_code;
      this.name = this.userInfo.user_name;
      console.log("this.code",this.code);
      console.log("this.name",this.name);
      this.name = this.userInfo.user_name;
        if (this.userInfo.user_code === this.code) {
      this.showButton = true;
    }
    }
  },
  mounted() {
    console.log("register-mouted");
    this.getDetail();
   
  },
  created() {
    // console.log("register-created",this.eventId);
    //  this.getDDInfo();
    this.eventId = this.$route.query.eventId;
    this.code = this.$route.query.code;
    this.userInfo = this.$store.state.user;
    // console.log("regiser-created-this.userInfo", this.userInfo);
    // console.log("register-created-this.name",this.name);
      // if (this.userInfo.user_code === this.code) {
      // this.showButton = true;
    // }
  },
  computed: {
    userCode2 () {
    return this.$store.state.user;　　//需要监听的数据user，获取工号与姓名信息
  }
  },
  methods: {
    getDetail() {
      getAcDetail({
        eventId: this.eventId
        // code: this.code
      }).then(response => {
        if (response.status === 200 && response.data.code === 2000) {
          this.task = response.data.items;
          // console.log(this.task);
          for (const v of this.task) {
            if (v.label === "优先级别") {
              if ("0" === v.value) {
                v.value = "高";
              } else if ("1" === v.value) {
                v.value = "中";
              } else if ("2" === v.value) {
                v.value = "低";
              }
            }
            if (v.label === "计划类型") {
              if ("0" === v.value) {
                v.value = "月计划";
              } else if ("1" === v.value) {
                v.value = "临时计划";
              }
            }
            if (v.label === "培训课时") {
              if ("1" === v.value) {
                v.value = "1课时";
              } else if ("2" === v.value) {
                v.value = "2课时";
              } else if ("3" === v.value) {
                v.value = "3课时";
              } else if ("4" === v.value) {
                v.value = "4课时";
              }
            }
            if (v.label === "培训类别") {
              if ("0" === v.value) {
                v.value = "质量";
              } else if ("1" === v.value) {
                v.value = "安全";
              } else if ("2" === v.value) {
                v.value = "技术";
              } else if ("3" === v.value) {
                v.value = "管理";
              } else if ("4" === v.value) {
                v.value = "其他";
              }
            }
            if (v.label === "培训状态") {
              if ("0" === v.value) {
                v.value = "未完成";
              } else if ("1" === v.value) {
                v.value = "已完成";
              } else if ("-1" === v.value) {
                v.value = "取消";
              }
            }
            if (v.label === "培训材料") {
              if (v.value != null && v.value != "") {
                this.files = JSON.parse(v.value);
                var value = [];
                for (var i = 0; i < this.files.length; i++) {
                  value.push(this.files[i].name);
                }
                v.value = value;
              }
            }
          }
          this.actual.id = this.eventId;
        } else {
          // else if (response.data.code === 2500) {
          //   this.showButton = true;
          // }
          console.log(response);
          this.$notify({
            title: "失败",
            message: response.status + response.data.msg,
            type: "error",
            duration: 2000
          });
        }
      });
    },
    sign() {
      signInfo({
        actualId: this.eventId,
        code: this.code,
        name: this.name
      }).then(response => {
        if (response.status === 200 && response.data.code === 2000) {
          this.$notify({
            title: "成功",
            message: "签到成功",
            type: "success",
            duration: 2000
          });
        } else if (response.status === 200 && response.data.code === 4000) {
          this.signStatus = "已签到";
          this.$notify({
            title: "失败",
            message: response.data.msg,
            type: "error",
            duration: 2000
          });
        } else {
          this.$notify({
            title: "失败",
            message: response.data.msg + ",自动跳转至主页面",
            type: "error",
            duration: 2000
          });
          this.$router.push({
            path: "/home"
          });
          console.log("跳转至培训台账主页面");
        }
      });
    },
        type(name) {
      var array = name.split(".");
      var type = array[1];
      if (type === "docx" || type === "xlsx" || type === "pptx"|| type === "xls" || type === "ppt") {
        return "other";
      } else if (type === "doc" ) {
        return "word";
      } else if (
        type === "jpg" ||
        type === "jpeg" ||
        type === "png" ||
        type === "JPG"
      ) {
        return "img";
      } else if (type === "pdf") {
        return "pdf";
      } else {
        return "other";
      }
    }
  }
};
</script>
<style lang="less" scoped>
@import "~vux/src/styles/1px.less";
@import "~vux/src/styles/center.less";
.rating_page {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  overflow: scroll;
}
</style>
